* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: #666;
}

body {
    // width: 10rem;
    min-width: 320px;
    max-width: 720px;
    margin: 0 auto;
    background-color: rgb(242, 244, 247);
    font: normal 14px/1.5 Tahoma, "Lucida Grande", Verdana, "Microsoft Yahei", STXihei, hei;
    color: #000;
    /* 水平滚动条不显示 */
    overflow-x: hidden;
    /* 取消高亮显示 */
    -webkit-tap-highlight-color: transparent;
}


// 当屏幕超过750px时，则设定html文字大小为75px，而不是无限制继续增长
@media screen and (min-width: 750px) {
    html {
        font-size: 75px !important;
    }
}

@base: 75;

header {
    // width: 10rem;
    height: (80rem / @base);
    line-height: (80rem / @base);
    text-align: center;
    // border-bottom: 1px solid #666;
    background-color: white;
    margin-bottom: 1px;
    font-size: (35rem / @base);

}

nav {
    // width: 10rem;
    display: flex;
    // justify-content: space-between;
    height: (520rem / @base) + 2.0267rem;
    text-align: center;
    flex-wrap: wrap;
    background-color: white;

    a {
        width: (240rem / @base);
        text-align: center;
        font-size: (25rem / @base);

        img {
            display: block;
            width: (108rem / @base);
            margin-left: 50%;
            transform: translateX(-50%);
            margin-top: (70rem / @base);
        }
    }

    .banner {
        width: (722rem / @base);
        height: (152rem / @base);
        margin-left: (14rem / @base);

        // transform: translateX(-50%);
        img {
            width: 100%;
        }
    }
}

.job {
    // ？？定位干啥
    position: relative;
    // 背景颜色和slide颜色相同即可模糊slide边缘

    background-color: #fff;

    .job_hd {
        height: 1.4667rem;
        line-height: 1.4667rem;

        img {
            float: left;
            margin-left: (10rem / 75);
            width: (38rem / 75);
            height: (38rem / 75);

            margin-top: (36rem / 75);
            margin-right: (5rem / 75);
        }

        span {
            float: left;
            font-size: .3733rem;
            font-weight: 600;

        }

        a {
            float: right;
            font-size: (22rem / @base);
        }
    }
}

.job_bd {
    .swiper-container {
        // width: 100%;
        // 根据需求定为540px？？
        width: (540rem / 75);
        height: 100%;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        // 设定主轴方向
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        transition: 300ms;
        // 缩放0.8
        transform: scale(0.8);
        // 不透明度0.4
        opacity: 0.4;

        a {
            width: (340rem / 75);
            height: (380rem / 75);

            img {
                width: 100%;
                height: 100%;
            }
        }

        p {
            width: (338rem / 75);
            font-size: (25rem / 75);
            // margin-top: (12rem / 75);
            color: #333;
        }
    }

    // 当前选中的slide，即中心位
    .swiper-slide-active,
    .swiper-slide-duplicate-active {
        transform: scale(1);
        z-index: 1;
        opacity: 1;
    }

    .swiper-button-next,
    .swiper-button-prev {
        outline: none;

        // 后伪类元素？？？
        // &:after {
        //     font-size: 1.066667rem;
        //     color: #333;
        // }
    }
}

.study_bd {
    .swiper-container {
        width: 100%;
    }

    .swiper-slide {
        a {
            height: (171rem / @base);
            width: (272rem / @base);

            img {
                width: 100%;
                height: 100%;
            }
        }

        p {
            font-size: (25rem / @base);
        }

        span {
            font-size: (25rem / @base);
            color: #ff4400;
        }
    }
}

footer {
    position: fixed;
    z-index: 99;
    display: flex;
    // justify-content: space-around;
    width: 10rem;
    height: (100rem / @base);
    bottom: 0;
    left: 0;
    background-color: #fff;
    line-height: (100rem / @base);
    text-align: center;

    a {
        flex: 1;
        // 一开始思路考虑过flex后续又转到margin上了
        display: flex;
        flex-direction: column;
        // justify-content: space-around;
        // align-items: center;
        font-size: (22rem / 75);
        // padding: (20rem / @base) 0;

        img {
            width: (40rem / 75);
            height: (40rem / 75);
            // display: block;
            margin-left: 50%;
            transform: translateX(-50%);
            margin-top: (10rem / @base);
            // vertical-align: middle;
        }

        p {
            line-height: (55.2rem /75);
        }
    }
}